<template>
  <div>
    <el-radio-group v-model="showValue" @change="changeTime">
      <!--    <el-radio-button label="上海"></el-radio-button>-->
      <!--    <el-radio-button label="北京"></el-radio-button>-->
      <!--    <el-radio-button label="广州"></el-radio-button>-->
      <!--    <el-radio-button label="深圳"></el-radio-button>-->
      <el-radio-button
          v-for="time in times"
          :key="time.value"
          :label="time.label"
      />
    </el-radio-group>
  </div>
</template>

<script>
import { times } from '../utils/GlobalVaribles'

export default {
    name: 'ChartTime',
    props: {
        value: {
            type: [String, Number],
            default: 1
        }
    },
    data () {
        return {
            showValue: '1小时'
        }
    },
    created () {
        this.showValue = times.find(time => time.value === this.value).label
    },
    computed: {
        times () {
            return times
        }
    },
    methods: {
        changeTime (label) {
            const time = times.find(time => time.label === label)
            console.log(label, 'time', time)
            this.$emit('update:value', time.value)
        }
    }
}
</script>

<style scoped>

</style>
